<!-- 按钮 》 上传 -->

<template>
  <el-upload ref="upload" v-bind="uploadProps">
    <el-button v-bind="{ ...commonProps, class: null }">
      <slot>
        <SlotBtn v-bind="slotProps" />
      </slot>
    </el-button>
  </el-upload>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import mixBtn from '../mixBtn'

const name = 'BtnUpload'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name,

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [mixBtn],

  /**
   * 属性注册
   */
  props: CORE.WEB[name],

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 上传属性
     */
    uploadProps() {
      const list = []

      if (this.isTxt) list.push('.txt')
      if (this.isDoc) list.push('.doc,.docx')
      if (this.isXls) list.push('.xls,.xlsx')
      if (this.isPpt) list.push('.ppt,.pptx')
      if (this.isPdf) list.push('application/pdf')
      if (this.isImage) list.push('image/*')
      if (this.isAudio) list.push('audio/*')
      if (this.isVideo) list.push('video/*')
      if (this.accept) list.push(this.accept)

      return {
        accept: list.join(),
        class: `${this.className} el-button`,
        action: '',
        beforeUpload: this.beforeUpload,
      }
    },
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 上传之前
     */
    beforeUpload(file) {
      this.$emit('change', file)
      this.$refs.upload.clearFiles()
      return false
    },
  },
}
</script>
